layui.config({
    base: 'assets/layuiadmin/' //静态资源所在路径
}).extend({
    index: 'lib/index' //主入口模块
}).use(['index', 'table', 'laytpl'], function(){
    var $ = layui.$,
        form = layui.form,
        table = layui.table;

    table.render({
        elem: '#role-table',
        url: 'role/list',
        toolbar: '#role-table-toolbar',
        title: '角色列表',
        height: globalHeight,
        page: true,
        cols: [[
            {type: 'checkbox'},
            {field: 'id', title: 'ID', width: 90, align: 'center'},
            {field: 'name', title: '名称', align: 'center'},
            {field: 'desc', title: '描述', align: 'center', templet:
                function (d) {
                    if(d.desc != null){
                        return d.desc.replace(/\n/gi, "<br>");
                    }
                    return "";
                }
            },
            {field: 'status', title: '状态', align: 'center', templet: '#statusTpl'},
            {field: 'createTime', title: '创建时间', align: 'center'},
            {title: '操作', align: 'center', toolbar: '#role-table-bar'}
        ]],
        parseData: function(result){
            return {
                "code": result.code, //解析接口状态
                "msg": result.msg, //解析提示文本
                "count": result.data.total, //解析数据长度
                "data": result.data.roles //解析数据列表
            };
        }
    });

    //头工具栏事件
    table.on('toolbar(role-table)', function(obj){
        var checks = table.checkStatus(obj.config.id);
        var data = checks.data;
        switch(obj.event){
            case 'add':
                layer.open({
                    type: 2,
                    title: '添加新角色',
                    offset: '25%',
                    content: 'toEditRole',
                    area: ['500px', '480px'],
                    btn: ['确定', '取消'],
                    yes: function (index, layero) {     //确定按钮回调
                        var iframeWindow = window['layui-layer-iframe'+ index],
                            submit = layero.find('iframe').contents().find("#role-submit");

                        //监听提交
                        iframeWindow.layui.form.on('submit(role-submit)', function(data){
                            var field = data.field; //获取提交的字段
                            // 加载层
                            var load = layerLoad();

                            //提交 Ajax 成功后，静态更新表格中的数据
                            post('role/add', field, field, function (data) {
                                layer.msg("添加成功");
                                table.reload('role-table');
                                layer.close(index); //关闭弹层
                                layer.close(load);
                            });
                        });

                        submit.trigger('click');
                    },
                });
                break;
            case 'del':
                if(data.length <= 0){
                    layer.msg("请选择要删除的角色！");
                    return;
                }
                layer.confirm('确定删除'+data.length+'个角色', {offset: '30%'}, function(index){
                    var ids = getIds(data, 'id');
                    // 加载层
                    var load = layerLoad();
                    post('role/del', {'ids': ids}, false, function (data) {
                        table.reload('role-table');
                        layer.msg("删除成功");
                        layer.close(index);
                        layer.close(load);
                    });
                });
                break;
        };
    });

    //监听行工具事件
    table.on('tool(role-table)', function(obj){
        var data = obj.data;
        if(obj.event === 'del'){
            layer.confirm('真的删除行么', {offset: '30%'}, function(index){
                var ids = [];
                ids.push(data.id);
                // 加载层
                var load = layerLoad();
                post('role/del', {'ids': ids}, false, function (data) {
                    obj.del();
                    layer.close(load);
                    layer.msg("删除成功");
                });
                layer.close(index);
            });
        } else if(obj.event === 'edit'){
            layer.open({
                type: 2,
                title: '编辑角色',
                offset: '25%',
                content: 'toEditRole',
                area: ['500px', '480px'],
                btn: ['确定', '取消'],
                success: function(layero, index){   //弹窗成功后回调
                    var iframeWindow = window['layui-layer-iframe' + index];
                    $(iframeWindow.document).find('#id').val(data.id);   //传值到iframe页面
                },
                yes: function (index, layero) {     //确定按钮回调
                    var iframeWindow = window['layui-layer-iframe'+ index],
                        submit = layero.find('iframe').contents().find("#role-submit");

                    //监听提交
                    iframeWindow.layui.form.on('submit(role-submit)', function(data){
                        var field = data.field; //获取提交的字段
                        // 加载层
                        var load = layerLoad();
                        post('role/edit', field, false, function (resultData) {
                            obj.update({
                                desc: field.desc,
                            });

                            layer.close(index); //关闭弹层
                            layer.close(load);
                            layer.msg("更新成功");
                        });
                    });

                    submit.trigger('click');
                },
            });
        }
    });

    //监听表格元素操作
    form.on('switch(changeStatus)', function(obj){
        var id = this.value;
        layer.confirm('确定更改该角色状态', {
            offset: '30%',
            btn1: function(index){
                // 加载层
                var load = layerLoad();
                post('role/changeStatus', {'id': id}, false, function (data) {
                    layer.msg("状态更改成功");
                    layer.close(index);
                    layer.close(load);
                }, function () {
                    $(obj.elem).prop('checked', !obj.elem.checked);
                    form.render();
                });
            },
            btn2: function(index){
                $(obj.elem).prop('checked', !obj.elem.checked);
                form.render();
            },
            cancel: function(index){
                $(obj.elem).prop('checked', !obj.elem.checked);
                form.render();
            }
        });
    });

});